<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<style type="text/css">
.ui-layout-north {
	z-index: 20 !important;
	overflow: visible !important;;
}

.ui-layout-north .ui-layout-unit-content {
	overflow: visible !important;
}

.ui-widget {
	font-size: 9px !important;
}

.size {
	width: 800px;
	position: relative;
	left: 17%;
	top: 10%;
}

.centro {
	top: 50%
}

.tabela {
	width: 800px;
}
</style>

	<title>Pesquisa de Atendimento</title>
</h:head>

<h:body>
	<ui:decorate template="/templateBase.xhtml">
		<ui:define name="center">
			<p:growl life="3000" id="growl" />
			<h:form id="formAtendimento">
				<br />
				<br />
				<br />
				<p:panel header="Pesquisa de Atendimento" styleClass="size"
					footer="SAIES - Sistema de Avaliação Institucional do Ensino Superior">
					<br />
					<p:tabView>
						<p:tab title="Por Pessoa">
							<h:panelGrid columns="3">
								<h:outputText value="ID:" />
								<p:inputText size="10"
									value="#{atendFoneBacking.codPessoaSelecionada}" />
								<p:commandButton icon="ui-icon-search"
									update=":formPesquisaPessoa:tblPessoa"
									oncomplete="dlgPessoa.show()" />
								<h:outputText value="Nome:" />
								<p:inputText size="50" value="#{atendFoneBacking.nomeInformado}" />
								<p:commandButton icon="ui-icon-search"
									actionListener="#{atendFoneBacking.buscaPessoaPorNome}"
									update=":formPesquisaPessoa2:tblPessoaNome"
									oncomplete="dlgPessoaNome.show()" />
							</h:panelGrid>
							<br />
							<div align="center">
								<p:dataTable value="#{atendFoneBacking.listaProtocolo}" var="p"
									paginator="true" id="tblProtocolo" rows="7"
									emptyMessage="Não foi encontrado nenhum protocolo de atendimento!">

									<p:column headerText="Nº Protocolo">
										<div align="center">
											<h:outputText value="#{p.codProtocolo}" />
										</div>
									</p:column>


									<p:column headerText="Data/Horário">
										<div align="center">
											<h:outputText value="#{p.dataAtendimento}">
												<f:convertDateTime timeZone="GMT-3"
													pattern="dd/MM/yyyy HH:mm:ss" />
											</h:outputText>
										</div>
									</p:column>

									<p:column headerText="Nome">
										<div align="center">
											<h:outputText value="#{p.pessoaAtendida.nome}" />
										</div>
									</p:column>

									<p:column headerText="Tipo">
										<div align="center">
											<h:outputText value="#{p.pessoaAtendida.tipo}" />
										</div>
									</p:column>

									<p:column headerText="Interesse">
										<div align="center">
											<h:outputText value="#{p.interesse}" />
										</div>
									</p:column>

									<p:column headerText="Atendente">
										<div align="center">
											<h:outputText value="#{p.atendente.nome}" />
										</div>
									</p:column>

									<p:column headerText="Visualizar">
										<div align="center">
											<p:commandButton icon="ui-icon-search" update=":formDetalhe"
												oncomplete="dlgDetalhe.show()"
												action="#{atendFoneBacking.selecionaProtocolo(p)}" />
										</div>
									</p:column>
								</p:dataTable>
							</div>
							<br />
							<p:separator />
							<br />
							<div align="center">
								<h:panelGrid columns="2">
									<p:commandButton value="Novo Atendimento"
										oncomplete="dlgPergunta.show()" update=":formPergunta" />
									<p:commandButton value="Limpar Formulário" />
								</h:panelGrid>
							</div>
						</p:tab>
						<p:tab title="Por Nº Protocolo">
							<h:panelGrid columns="2">
								<h:outputText value="Nº Protocolo:" />
								<p:inputText size="10"
									value="#{atendFoneBacking.codprotocoloInformado}">
									<p:ajax
										listener="#{atendFoneBacking.pesquisaAtendPorProtocolo}"
										event="blur" process="@all" update="tblProtocolo2,txtNome" />
								</p:inputText>
								<h:outputText value="Nome:" />
								<p:inputText size="50" disabled="true" id="txtNome"
									value="#{atendFoneBacking.protocoloInformado.pessoaAtendida.nome}" />
							</h:panelGrid>
							<br />
							<div align="center">
								<p:dataTable value="#{atendFoneBacking.protocoloInformado}"
									var="p" paginator="true" id="tblProtocolo2" rows="7"
									emptyMessage="Não foi encontrado nenhum protocolo de atendimento!">

									<p:column headerText="Nº Protocolo">
										<div align="center">
											<h:outputText value="#{p.codProtocolo}" />
										</div>
									</p:column>


									<p:column headerText="Data/Horário">
										<div align="center">
											<h:outputText value="#{p.dataAtendimento}">
												<f:convertDateTime timeZone="GMT-3"
													pattern="dd/MM/yyyy HH:mm:ss" />
											</h:outputText>
										</div>
									</p:column>

									<p:column headerText="Nome">
										<div align="center">
											<h:outputText value="#{p.pessoaAtendida.nome}" />
										</div>
									</p:column>

									<p:column headerText="Tipo">
										<div align="center">
											<h:outputText value="#{p.pessoaAtendida.tipo}" />
										</div>
									</p:column>

									<p:column headerText="Interesse">
										<div align="center">
											<h:outputText value="#{p.interesse}" />
										</div>
									</p:column>

									<p:column headerText="Atendente">
										<div align="center">
											<h:outputText value="#{p.atendente.nome}" />
										</div>
									</p:column>

									<p:column headerText="Visualizar">
										<div align="center">
											<p:commandButton icon="ui-icon-search" update=":formDetalhe"
												oncomplete="dlgDetalhe.show()"
												action="#{atendFoneBacking.selecionaProtocolo(p)}" />
										</div>
									</p:column>
								</p:dataTable>
							</div>
							<br />
						</p:tab>
					</p:tabView>
				</p:panel>
			</h:form>

			<h:form id="formPesquisaPessoa">
				<p:dialog widgetVar="dlgPessoa" width="650" height="500"
					showEffect="clip" hideEffect="clip">
					<p:dataTable id="tblPessoa" rows="20"
						value="#{atendFoneBacking.listaPessoa}" var="p">

						<p:column headerText="ID">
							<h:outputText value="#{p.id}" />
						</p:column>

						<p:column headerText="Nome">
							<h:outputText value="#{p.nome}" />
						</p:column>

						<p:column headerText="Tipo">
							<h:outputText value="#{p.tipo}" />
						</p:column>

						<p:column headerText="Telefone">
							<h:outputText value="#{p.telefoneFixo}" />
						</p:column>

						<p:column headerText="Celular">
							<h:outputText value="#{p.celular}" />
						</p:column>

						<p:column headerText="Ações">
							<p:commandButton value="Selecionar"
								actionListener="#{atendFoneBacking.selecionaPessoa(p)}"
								oncomplete="dlgPessoa.hide()" update=":formAtendimento" />
						</p:column>

					</p:dataTable>
				</p:dialog>
			</h:form>

			<h:form id="formPesquisaPessoa2">
				<p:dialog widgetVar="dlgPessoaNome" width="650" height="500"
					showEffect="clip" hideEffect="clip">
					<p:dataTable id="tblPessoaNome" rows="20"
						value="#{atendFoneBacking.listaPessoaPorNome}" var="p">

						<p:column headerText="ID">
							<h:outputText value="#{p.id}" />
						</p:column>

						<p:column headerText="Nome">
							<h:outputText value="#{p.nome}" />
						</p:column>

						<p:column headerText="Tipo">
							<h:outputText value="#{p.tipo}" />
						</p:column>

						<p:column headerText="Telefone">
							<h:outputText value="#{p.telefoneFixo}" />
						</p:column>

						<p:column headerText="Celular">
							<h:outputText value="#{p.celular}" />
						</p:column>

						<p:column headerText="Ações">
							<p:commandButton value="Selecionar"
								actionListener="#{atendFoneBacking.selecionaPessoa(p)}"
								oncomplete="dlgPessoaNome.hide()" immediate="true"
								update=":formAtendimento" process="@this" />
						</p:column>

					</p:dataTable>
				</p:dialog>
			</h:form>

			<h:form id="formPergunta">
				<p:dialog widgetVar="dlgPergunta" width="350" height="110"
					showEffect="clip" hideEffect="clip" header="?"
					footer="SAIES - Sistema de Avaliação Institucional do Ensino Superior">
					<br />
					<h4>Você deseja realizar atendimento para a pessoa selecionada
						na pesquisa (#{atendFoneBacking.pessoaSelecionada.nome}) ?</h4>

					<br />
					<div align="center">
						<h:panelGrid columns="2">
							<p:commandButton value="Sim"
								action="#{atendFoneBacking.iniciaAtendPessoaSelecionada}" />
							<p:commandButton value="Não"
								action="#{atendFoneBacking.iniciaNovoAtendimento}" />
						</h:panelGrid>
					</div>
				</p:dialog>
			</h:form>

			<h:form id="formDetalhe">
				<p:dialog widgetVar="dlgDetalhe" width="550" height="400"
					showEffect="clip" hideEffect="clip"
					header="Detalhe do Atendimento - Nº Protocolo - #{atendFoneBacking.protocoloSelecionado.codProtocolo}"
					footer="SAIES - Sistema de Avaliação Institucional do Ensino Superior">
					<br />
					<h:panelGrid columns="2">
						<h:outputText value="Nº Protocolo:" />
						<p:inputText size="10" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.codProtocolo}" />
						<h:outputText value="Nome:" />
						<p:inputText size="50" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.pessoaAtendida.nome}" />
						<h:outputText value="Tipo:" />
						<p:inputText size="50" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.pessoaAtendida.tipo}" />
						<h:outputText value="Interesse:" />
						<p:inputText size="50" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.interesse}" />
						<h:outputText value="Assunto:" />
						<p:inputText size="50" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.assunto}" />
						<h:outputText value="Descrição: " />
						<p:inputTextarea autoResize="true" rows="6" cols="90"
							required="true" disabled="true"
							value="#{atendFoneBacking.protocoloSelecionado.descricaoInteresse}"
							requiredMessage="Informe a descrição do atendimento!" />
					</h:panelGrid>
					<br />
					<p:dataTable
						emptyMessage="Este protocolo não teve nenhum agendamento para retorno de contato!">
						<p:column id="ID" headerText="ID">

						</p:column>

						<p:column headerText="Dia do Retorno">

						</p:column>

						<p:column headerText="Nº Tentativas">

						</p:column>

						<p:column headerText="Ocorrência">

						</p:column>

						<p:column headerText="Situação">

						</p:column>

						<p:column headerText="Visualizar">

						</p:column>

					</p:dataTable>

				</p:dialog>
			</h:form>

		</ui:define>
	</ui:decorate>
</h:body>
</html>